<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>账户管理</title>
    <!-- Bootstrap -->
    <link href="../css/bootstrap.min.css" rel="stylesheet"/>
    <link href="../select2/css/select2.min.css" rel="stylesheet"/>

    <script type="text/javascript" src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script type="text/javascript" src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../select2/js/select2.min.js"></script>

    <!-- Include Required Prerequisites -->
    <script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>

    <!-- Include Date Range Picker -->
    <script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />
</head>
<body>
    <div id="header" th:include="header :: fragment-header"></div>

    <div id="accountMsg" th:include="account_form :: fragment-accountMsg">


    </div>

    <!--<div id="eventMsg" th:include="common :: fragment-eventMsg"></div>

    <div style="padding-top: -15px;margin-top: -15px;padding-left: 20%;padding-right: 25%;">
        <form th:action="@{/account/addAccount}" method="post" class="form-horizontal">
            <div class="form-group" style="margin-bottom: 35px;">
                <label for="encode" class="col-sm-2 control-label">编码</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" name="encode" id="encode" th:value="${account.getEncode()}"
                           placeholder="账号编码，不能重复，且必须以字母开头">
                </div>
            </div>

            <div class="form-group" style="margin-bottom: 35px;">
                <label for="name" class="col-sm-2 control-label">名称</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" name="name" id="name" th:value="${account.getName()}" placeholder="账号名称">
                </div>
            </div>

            <div class="form-group" style="margin-bottom: 35px;">
                <label for="accountType" class="col-sm-2 control-label">账号类型</label>
                <div class="col-sm-10">
                    <select class="js-example-basic-single js-states form-control" id="accountType" name="accountType">
                        <option value="NORMAL">NORMAL</option>
                        <option value="SHOP_ADMIN">SHOP_ADMIN</option>
                        <option value="AREA_ADMIN">AREA_ADMIN</option>
                        <option value="AREA_ADMIN">SUPER_ADMIN</option>
                    </select>
                </div>
            </div>

            <div class="form-group" style="margin-bottom: 35px;">
                <label class="col-sm-2 control-label">状态</label>
                <div class="col-sm-10">
                    &lt;!&ndash;<select class="js-example-basic-single js-states form-control" id="status" name="status">&ndash;&gt;
                        &lt;!&ndash;<option value="NORMAL">NORMAL</option>&ndash;&gt;
                        &lt;!&ndash;<option value="FREEZN" selected = 'selected'>FREEZN</option>&ndash;&gt;
                    &lt;!&ndash;</select>&ndash;&gt;
                    <div class="input-group" style="padding-top: 6px;">
                        <input type="text" class="hidden" id="status" value="NORMAL"/>
                        <label>
                            <input type="radio" value="NORMAL" name="status" checked="checked"  onclick="radioChecked(this)"/>&nbsp;NORMAL&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                        </label>
                        <label>
                            <input type="radio" value="FREEZN" name="status" onclick="radioChecked(this)"/>&nbsp;FREEZN
                        </label>
                    </div>
                </div>
            </div>

            <div class="form-group" style="margin-bottom: 35px;">
                <label for="comment" class="col-sm-2 control-label">备注</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" name="comment" th:value="${account.getComment()}" id="comment" placeholder="备注">
                </div>
            </div>

            &lt;!&ndash;<div class="form-group" style="margin-bottom: 35px;">&ndash;&gt;
                &lt;!&ndash;<label for="createTime" class="col-sm-2 control-label">创建时间</label>&ndash;&gt;
                &lt;!&ndash;<div class="col-sm-10">&ndash;&gt;
                    &lt;!&ndash;<input type="text" class="form-control" name="createTime" id="createTime">&ndash;&gt;
                &lt;!&ndash;</div>&ndash;&gt;
            &lt;!&ndash;</div>&ndash;&gt;

            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default" onclick="submitForm()">Submit</button>
                </div>
            </div>
        </form>
    </div>-->
    <script type="text/javascript">
        $(".js-example-basic-single").select2();
        var radioChecked = (function (obj) {
            var status = $(obj).val();
            $("#newStatus").attr("value" , status);
        })

        var submitForm = (function () {
            var encode = $("#newEncode").val();
            var name = $("#newName").val();
            var accountType = $("#newAccountType").val();
            var acc_status = $("#newStatus").val();
            var comment = $("#newComment").val();

            if(encode == '' || encode == null){
                alert("编码不能为空；")
                return;
            }

            requestData = {
                "encode": encode,
                "name": name,
                "accountType": accountType,
                "status": acc_status,
                "comment": comment
            };

//            alert(JSON.stringify(requestData))

            $.ajax({
                url: "/account/addAccount",
                type: 'POST',
                dataType: 'html',
                data: requestData,
                success: function(result){
                    $("#accountMsg").html(result);
                },
                error: function (result) {
                    alert("添加账户失败；")
                }
            });
        })
    </script>
</body>
</html>